<template>
  <div class="app">
    <header class="app_header">头部内容</header>
    <section class="app_main">
      <aside class="app_aside">导航</aside>
      <section class="app_sect"><Nuxt /></section>
    </section>
  </div>
</template>


<style >

html,
body,
#_nuxt,
#_layout {
  height: 100%;
}

</style>

<style scoped>
body {
  margin: 0;
  padding: 0;
}

.app {
  display: flex;
  flex-direction: column;
}

.app_main {
  display: flex;
  flex-grow: 1;
  height: 90.5vh;

}

.app_header {
  height: 60px;
  background-color: blue;
}

.app_aside {
  width: 150px;
  height: 100%;
  background-color: cadetblue;
}

.app_sect {
  background-color: darkgreen;
  flex: 1;
}
</style>
